<div class=" login">
    <!-- BEGIN LOGO -->
    <div class="logo">
        <img src="{{settings.layoutPath}}/images/browser.png" alt="" width="30" height="30"/>
    </div>
    <!-- END LOGO -->
    <!-- BEGIN LOGIN -->
    <div class="content" style="width: 750px">
        <div ng-class="vm.flash.classNames" ng-bind="vm.flash.message" ng-if="vm.flash"></div>
        <form name="vm.form" class="form-horizontal form-bordered">

            <div class="form-group" ng-class="{
         'has-success': vm.form.user_name.$dirty && vm.form.user_name.$valid,
            'has-error': vm.form.user_name.$touched && vm.form.user_name.$invalid
            }">
                <label class="col-sm-3 control-label" for="user_name"><span class="red-star">*</span>用户名：</label>
                <div class="col-sm-8">
                    <input type="text" style="float:left;width:220px"placeholder="用户名" class="form-control" name="user_name" id="user_name"
                           ng-model="vm.user.user_name" ng-maxlength="20" ng-change="vm.invalid();" required>
                    <span class="errorMsg" style="line-height: 35px;margin-left: 5px;"
                          ng-if="vm.form.user_name.$dirty && vm.form.user_name.$invalid">
                        <span ng-if="vm.form.user_name.$error.required"><span class="red-star">用户名不能为空</span></span>
                         <span ng-if="!vm.form.user_name.$error.required && vm.form.user_name.$invalid"><span class="red-star">用户名不能超过20位</span></span>
                    </span>
                    <div ng-show="serverError" id="error1"><span class="red-star">{{ serverError }}</span></div>
                </div>
            </div>
            <div class="form-group" ng-class="{
         'has-success': vm.form.pass_word.$dirty && vm.form.pass_word.$valid,
            'has-error': vm.form.pass_word.$touched && vm.form.pass_word.$invalid
            }">
                <label class="col-sm-3 control-label" for="pass_word"><span class="red-star">*</span>密码：</label>

                <div class="col-sm-8">
                        <input style="float:left;width:220px" placeholder="请输入6~20位密码" type="password" minlength="6" maxlength="20"
                               class="form-control" name="pass_word" ng-model="vm.user.pass_word" required>
                        <span class="errorMsg"  style="line-height: 35px;margin-left: 5px;"
                              ng-if="vm.form.pass_word.$dirty && vm.form.pass_word.$invalid">
                            <span ng-if="!vm.form.pass_word.$error.required && vm.form.pass_word.$invalid"><span class="red-star">请输入6~20位密码</span></span>
                    </span>
                </div>
            </div>
            <div class="form-group" ng-class="{
         'has-success': vm.form.pass_word_reply.$dirty && vm.form.pass_word_reply.$valid,
            'has-error': vm.form.pass_word_reply.$touched && vm.form.pass_word_reply.$invalid
            }">
                <label class="col-sm-3 control-label" for="pass_word_reply"><span class="red-star">*</span>确认密码：</label>

                <div class="col-sm-8" >
                    <input style="float:left;width:220px" placeholder="请输入确认密码" type="password" minlength="6" maxlength="20" class="form-control"
                           name="pass_word_reply" ng-model="vm.user.pass_word_reply" required>
                    <span class="errorMsg"  style="line-height: 35px;margin-left: 5px;" ng-if="vm.pwdInvalid"><span class="red-star">确认密码与密码不一致</span></span>
                </div>
            </div>

            <div class="form-actions">
                <div class="row">
                    <div class="col-md-offset-3 col-md-9">
                        <button type="submit" class="btn green" ng-click="vm.add()"
                                ng-disabled="vm.form.$invalid||vm.registerSending">
                            <i class="fa fa-check"></i> 确认
                        </button>
                        <button type="button" class="btn default" ng-click="vm.cancel()">取消</button>
                    </div>
                </div>
            </div>


        </form>
    </div>
</div>

<div>
    <script type="text/ng-template" id="myModalContent.html">
        <div class="modal-header">
            <h4 class="modal-title">保存成功</h4>
        </div>

        <div class="modal-footer">
            <button class="btn btn-primary" type="button" ng-click="ok()">确认</button>
            <!--<button class="btn btn-warning" type="button" ng-click="cancel()">Cancel</button>-->
        </div>
    </script>
</div>